<template>
  <div>
    <el-dialog :fullscreen="fullscreen" append-to-body :visible.sync="isShow2" width="700px" :show-close="false" :before-close="parentCloseEvent" top="3%">
        <el-row slot="title">
            <el-col :span="10" style="padding-top: 5px">
                <span>活动管理</span>
            </el-col>
            <el-col :span="2" :offset="11">
                <el-button type="text" v-if="!fullscreen" icon="iconfont ali-quanping" @click="fullscreen = true" style="float: right"></el-button>
                <el-button type="text" v-else icon="iconfont ali-zuixiaohua" @click="fullscreen = false" style="float: right"></el-button>
            </el-col>
            <el-col :span="1">
                <el-button type="text" icon="iconfont ali-guanbi" @click="parentCloseEvent" style="float: right"></el-button>
            </el-col>
        </el-row>
        <!-- 工具栏 -->
        <section class="filter-container">
            <el-button class="filter-item" type="primary" @click="delData()">删除</el-button>
        </section>
         <!-- 表格 -->
    <el-table :data="tableList" v-loading="loading" element-loading-text="正在查询中。。。" stripe highlight-current-row @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55"/>
      <el-table-column align="center" width="90">
        <template slot-scope="scope">
          <el-tag size="mini" :type="t_active[scope.row.active_status - 1].type">{{t_active[scope.row.active_status - 1].name}}</el-tag>
        </template>
      </el-table-column>
      <el-table-column align="center" width="30">
        <template slot-scope="scope">
          <i class="iconfont ali-zhiding" v-show="scope.row.top_status == 1"></i>
        </template>
      </el-table-column>
      <el-table-column align="center" label="活动主题" prop="active_title" show-overflow-tooltip>
      </el-table-column>
      <el-table-column align="center" label="活动时间" width="150px" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{scope.row.active_start_time}}</span><br/>
          <span>{{scope.row.active_end_time}}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" label="地点" prop="active_address" show-overflow-tooltip>
      </el-table-column>
      <el-table-column align="center" label="开始报名时间" width="150px" prop="signup_start_time">
      </el-table-column>
      <el-table-column align="center" label="报名人数">
        <template slot-scope="scope">
          <el-button size="mini" type="text" @click="alreadySign(scope.row)">{{scope.row.readyapply_nums}} / {{scope.row.allow_num}}</el-button>
        </template>
      </el-table-column>
      <el-table-column align="center" label="浏览量" prop="browse_nums">
      </el-table-column>
      <el-table-column align="center" label="报名范围" width="100px" show-overflow-tooltip>
        <template slot-scope="scope">
          <i v-for="item in scope.row.activeRanges" :key="item.id">
            <span>{{item.organization_name}}</span>/
          </i>
        </template>
      </el-table-column>
      <el-table-column align="center" label="发布时间" prop="create_time">
      </el-table-column>
      <el-table-column align="center" label="状态">
        <template slot-scope="scope">
          <el-tag size="mini" type="success">{{t_status[scope.row.close_status]}}</el-tag>
        </template>
      </el-table-column>
      <el-table-column align="center" label="列表链接">
        <template slot-scope="scope">
          <el-button
            v-clipboard:copy="'https://cloud.anyolife.com/ActivityHome'"
            v-clipboard:success="onCopy"
            v-clipboard:error="onError"
            type="text"
          >复制链接</el-button>
        </template>
      </el-table-column>
      <el-table-column align="center" label="详情链接">
        <template slot-scope="scope">
          <el-button
            v-clipboard:copy="'https://cloud.anyolife.com/ActivityDetail' + '?id=' + scope.row.id 
            + '&status=' + scope.row.active_status + '&name=' + 'home'"
            v-clipboard:success="onCopy"
            v-clipboard:error="onError"
            type="text"
          >复制链接</el-button>
        </template>
      </el-table-column>
    </el-table>
        <!-- 分页 -->
        <section>
        <so-pagination :query="listQuery" @initList="initList"/>
        </section>
    </el-dialog>
  </div>
</template>
<script>
import SoPagination from "@/components/SoPagination";
import { actityManager_deleteAll, actityManager_list } from "@/api/actityManager";
import { status_opt, t_active, t_status, toolData } from "../activity";

export default {
  components: {
    SoPagination
  },
  props: {
      isShow2: {
          type: Boolean,
          default: false
      }
  },
  data() {
      return {
            listQuery: { start: 0, limit: 10, total: 0, current: 1 },
            tableList: [],
            loading: false,
            multipleSelection: [],
            t_active: t_active,
            t_status: t_status,
            status_opt: status_opt,
            fullscreen: false
      }
  },
    methods: {
        onCopy: function() {
            this.$message({
            type: "success",
            message: "复制成功"
            });
        },
        onError: function() {
            this.$message.error("复制失败");
        },
        // 删除数据
        async delData(){
          //this.$emit("editActivity", this.multipleSelection);
           if(this.multipleSelection.length == 0){
             this.$message.warning("请先选择需要调整单元");
               return;
           }
            let ids = this.multipleSelection.map(item => item.id).join();
            try {
                const res = await this.$confirm("确认删除吗？");
                if (res == "confirm") {
                    this.loading = true;
                    const { data } = await actityManager_deleteAll({ array: ids });
                    if (data.status == 100) {
                        this.$message.success("删除成功");
                    }
                    this.initList();
                }
                } catch (error) {
                    this.$message.err("删除失败");
                }
        },
        //查询数据
        async initList() {
        this.loading = true;
        const query = {
          ...this.listQuery, company_id: localStorage.getItem("companyId") - 0,
           pageSet_id: sessionStorage.getItem("pageSetRow_Id") - 0,
           organization_id: sessionStorage.getItem("organization_id") - 0, 
        };
        const { data } = await actityManager_list(query); 
        this.loading = false;
            if (data.status == 100) {
                this.tableList = data.data.rows;
                this.listQuery.total = data.data.results;
                this.inhand_count = data.data.inhand_count;
            }
        },
        handleSelectionChange(e) {
            this.multipleSelection = e;
        },
        parentCloseEvent() {
            this.$emit('closeTemp');
        },
    }
};
</script>
